<!--header str-->
{template "common","header"}
<!--header end-->
<script type="text/javascript" src="{JS_PATH}jquery.form.min.js"></script> 
<script type="text/javascript" src="{JS_PATH}formvalidator.js" charset="UTF-8"></script>
<script type="text/javascript" src="{JS_PATH}formvalidatorregex.js" charset="UTF-8"></script>
<script type="text/javascript" src="{JS_PATH}layer/layer.min.js"></script>
<script language="JavaScript">
<!--
$(function(){
	$.formValidator.initConfig({autotip:true,formid:"myform",onerror:function(msg){}});
	$("#name").formValidator({onshow:"请输入项目名称"}).inputValidator({min:1,onerror:"请输入项目名称"});
	$("#unit").formValidator({onshow:"请输入项目单位"}).inputValidator({min:1,onerror:"项目单位不能为空"});
	$("#project_type").formValidator({onshow:"请输入项目类型"}).inputValidator({min:1,onerror:"项目类型不能为空"});
	$("#last_updated_time").formValidator({onshow:"请输入项目发起日期",onfocus:"格式：2000-01-01"}).inputValidator({min:10,max:10,onerror:"格式：2000-01-01"});
	$("#short_content").formValidator({onshow:"请输入项目描述"}).inputValidator({min:1,onerror:"请输入项目描述"});
	$("#amount").formValidator({onshow:"请输入融资金额"}).inputValidator({min:1,onerror:"请输入融资金额"});
	$("#contact").formValidator({onshow:"请输入联系人"}).inputValidator({min:1,onerror:"联系人不能为空"});
	$("#mobile").formValidator({onshow:"请输入手机号码"}).inputValidator({min:11,max:11,onerror:"请输入正确的号码"});
});
-->
function uploadImage() { 
	$.ajax({  
	    type: "POST",  
	    url: "/?m=hchindex&c=upload&a=img",  
	    data: { imgPath: $("#uploadFile").val() },  
	    cache: false,  
	    success: function(data) {  
	        if(data.err == '0'){
	        	$('#user_project_img').src=data.url
	        }else{
	        	alert(data.msg);
	        }
	    },  
	    error: function(XMLHttpRequest, textStatus, errorThrown) {  
	        alert("上传失败，请检查网络后重试");  
	    }  
	});  
}

$(function () { 
    var bar = $('.bar'); 
    var percent = $('.percent'); 
    var showimg = $('#showimg'); 
    var progress = $(".progress"); 
    var files = $(".files"); 
    var btn = $(".btn span"); 
    $("#fileupload").wrap("<form id='myupload' action='/?m=hchindex&c=upload&a=img' method='post' enctype='multipart/form-data'></form>"); 
    $("#fileupload").change(function(){ //选择文件 
        $("#myupload").ajaxSubmit({ 
            dataType:  'json', //数据格式为json 
            beforeSend: function() { //开始上传 
                showimg.empty(); //清空显示的图片 
                //progress.show(); //显示进度条 
                var percentVal = '0%'; //开始进度为0% 
                bar.width(percentVal); //进度条的宽度 
                //percent.html(percentVal); //显示进度为0% 
                btn.html("上传中..."); //上传按钮显示上传中 
            }, 
            uploadProgress: function(event, position, total, percentComplete) { 
                var percentVal = percentComplete + '%'; //获得进度 
                bar.width(percentVal); //上传进度条宽度变宽 
                //percent.html(percentVal); //显示上传进度百分比 
            }, 
            success: function(data) { //成功 
                //获得后台返回的json数据，显示文件名，大小，以及删除按钮 
                //files.html("<b>"+data.name+"("+data.size+"k)</b><span class='delimg' rel='"+data.pic+"'>删除</span>"); 
                //显示上传后的图片 
                var img = "./uploadfile/"+data.pic;
                showimg.html("<img src='"+img+"' id='user_project_img' height='100'>"); 
                $("#img").val(img);
                btn.html("添加图片"); //上传按钮还原 
            }, 
            error:function(xhr){ //上传失败 
                btn.html("上传失败"); 
                bar.width('0'); 
                files.html(xhr.responseText); //返回失败信息 
            } 
        }); 
    }); 
}); 

</script>
<style>
.btn{position: relative;overflow: hidden;margin-right: 4px;display:inline-block; 
*display:inline;padding:4px 10px 4px;font-size:14px;line-height:18px; 
*line-height:20px;color:#fff; 
text-align:center;vertical-align:middle;cursor:pointer;background:#5bb75b; 
border:1px solid #cccccc;border-color:#e6e6e6 #e6e6e6 #bfbfbf; 
border-bottom-color:#b3b3b3;-webkit-border-radius:4px; 
-moz-border-radius:4px;border-radius:4px;} 
.btn input{position: absolute;top: 0; right: 0;margin: 0;border:solid transparent; 
opacity: 0;filter:alpha(opacity=0); cursor: pointer;} 
.progress{position:relative; margin-left:100px; margin-top:-24px;  
width:200px;padding: 1px; border-radius:3px; display:none} 
.bar {background-color: green; display:block; width:0%; height:20px;  
border-radius:3px; } 
.percent{position:absolute; height:20px; display:inline-block;  
top:3px; left:2%; color:#fff } 
.files{height:22px; line-height:22px; margin:10px 0} 
.delimg{margin-left:20px; color:#090; cursor:pointer} 
</style>

<!--wrap_activity str-->
<div class="wrap" id="wrap">
	<table>
		<tr>
			<td class="item_table_left">
				<br/><br/>
				{template "common","left_menu"}
			</td>
			<td class="item_table_right">
				<div class="wrap_main">
					<div class="bullet more_height">
						<div class="bullet_title"><label class="user_detail_title heiti">发起一个项目</label></div>
						<div class="bullet_menu more_bottom">
							<label class="user_detail_menu">&lt;&lt;项目列表</label>
						</div>
					</div>
					<hr>
					<div class="content_title"></div>
					<div class="content">
						<form onsubmit="return check_form();" action="/index.php?m=hchmember&c=detail&a=startproject" method="post" enctype="multipart/form-data">
							<table class="user_detail">
                                <tr>
                                    <th>区域选择</th>
                                    <td>
                                        <select name="aid_1" id="province" onchange="getcity();">
                                            <option value="">请选择省份</option>
                                            {loop $area_list $area}
                                            <option value="{$area[id]}">{$area[area_name]}</option>
                                            {/loop}
                                        </select>
                                        <select name="aid_2" id="city" onchange="getarea();">
                                            <option value="">请选择城市</option>
                                        </select>
                                        <select name="aid_3" id="area">
                                            <option value="">请选择地区</option>
                                        </select>
                                    </td>
                                </tr>
								<tr>
									<th>项目名称</th>
									<td><input type="text" value="{$crowdfunding[name]}" name="item[name]" id="name"> </td>
									<td rowspan="4" align="center" >
										<div id="user_project_upload"> 
											<div id="showimg"><img src='{$crowdfunding[img]}' height='100'></div>
											<div class="btn"> 
											     <span>添加图片</span> 
											     <input id="fileupload" type="file" name="mypic"> 
											</div> 
											<div class="progress"> 
											    <span class="bar"></span><span class="percent">0%</span > 
											</div> 
											<div class="files"></div>
											<input type="hidden" value="{$crowdfunding[img]}" name="item[img]" id="img" readonly="readonly">
										</div>
									</td>
								</tr>
								<tr>
									<th>项目单位</th>
									<td>
										<input type="text" value="{$crowdfunding[unit]}" name="item[unit]" id="unit">
									</td>
								</tr>
								<tr>
									<th>项目类型</th>
									<td>
										<input type="text" value="{$crowdfunding[project_type]}" name="item[project_type]" id="project_type">
									</td>
								</tr>
								<tr>
									<th>发起日期</th>
									<td><input type="text" value="{$crowdfunding[last_updated_time]}" name="item[last_updated_time]" id="last_updated_time"> </td>
								</tr>
								<tr>
									<th>项目描述</th>
									<td colspan="2">
										<textarea rows="5" cols="50" name="item[short_content]" id="short_content">{$crowdfunding[short_content]}</textarea>
									</td>
								</tr>
								<tr>
									<th>融资金额</th>
									<td><input type="text" value="{$crowdfunding[amount]}" name="item[amount]" id="amount"> </td>
								</tr>
								<tr>
									<th>联系人</th>
									<td><input type="text" value="{$crowdfunding[contact]}" name="item[contact]" id="contact"> </td>
								</tr>
								<tr>
									<th>手机</th>
									<td><input type="text" value="{$crowdfunding[mobile]}" name="item[mobile]" id="mobile"> </td>
								</tr>
								<tr>
									<th>备注</th>
									<td colspan="2">
										<textarea rows="5" cols="50" name=item[remark] id="remark">{$crowdfunding[remark]}</textarea>
									</td>
								</tr>
								<tr>
									<th>&nbsp;</th>
									<td colspan="2">
                                        <input type="submit" class="submit" name="dosubmit" value="发起项目"/>
                                    </td>
									<input type="hidden" name="m" value="hchmember">
									<input type="hidden" name="c" value="detail">
									<input type="hidden" name="a" value="startproject">
								</tr>
							</table>
						</form>
						<br style="clear: both;">
					</div>
				</div>
			</td>
		</tr>
	</table>
</div>
<!--wrap end-->
<!--footer str-->
{template "common","footer"}
<!--footer end-->
<script type="text/javascript">  
  if( !('placeholder' in document.createElement('input')) ){  
   
    $('input[placeholder],textarea[placeholder]').each(function(){   
      var that = $(this),   
      text= that.attr('placeholder');   
      if(that.val()===""){   
        that.val(text).addClass('placeholder');   
      }   
      that.focus(function(){   
        if(that.val()===text){   
          that.val("").removeClass('placeholder');   
        }   
      })   
      .blur(function(){   
        if(that.val()===""){   
          that.val(text).addClass('placeholder');   
        }   
      })   
      .closest('form').submit(function(){   
        if(that.val() === text){   
          that.val('');   
        }   
      });   
    });   
  }
    function getcity(){
        var aid = $('#province').val();
        var url = "/index.php?m=hchmember&c=detail&a=get_area&aid=" + aid;

        $.ajax({
            type: 'GET',
            url:url,
            dataType:'json',
            data:'',
            success:function(data){
                $("#city").html('');
                $("#area").html('<option value="">请选择地区</option>');
                $("#city").append('<option value="">请选择城市</option>');
                $.each(data,function(index,val){
                    $("#city").append('<option value='+val.id+' >'+val.area_name+'</option>');
                });
            }
        });
    }
    function getarea(){
        var aid = $('#city').val();
        var url = "/index.php?m=hchmember&c=detail&a=get_area&aid=" + aid;

        $.ajax({
            type: 'GET',
            url:url,
            dataType:'json',
            data:'',
            success:function(data){
                $("#area").html('');
                $("#area").append('<option value="">请选择地区</option>');
                $.each(data,function(index,val){
                    $("#area").append('<option value='+val.id+' >'+val.area_name+'</option>');
                });
            }
        });
    }
    function check_form(){
        //区域选择
        var city = $('#city').val();
        if(!city){
            alert("请选择项目所属地区！");
            return false;
        }
        //项目名称
        var name = $('#name').val();
        if(!name){
            alert("请输入项目名称！");
            return false;
        }
        //项目单位
        var unit = $('#unit').val();
        if(!unit){
            alert("请输入项目单位！");
            return false;
        }
        //项目类型
        var project_type = $('#project_type').val();
        if(!project_type){
            alert("请输入项目类型！");
            return false;
        }
        //发起日期
        var last_updated_time = $('#last_updated_time').val();
        if(!last_updated_time){
            alert("请输入项目发起日期！");
            return false;
        }
        //项目描述
        var short_content = $('#short_content').val();
        if(!short_content){
            alert("请输入项目描述！");
            return false;
        }
        //融资金额
        var amount = $('#amount').val();
        if(!amount){
            alert("请输入融资金额！");
            return false;
        }
        //联系人
        var contact = $('#contact').val();
        if(!contact){
            alert("请输入联系人！");
            return false;
        }
        //手机号码
        var mobile = $('#mobile').val();
        if(!mobile){
            alert("请输入联系方式！");
            return false;
        }
        var reg= /^1\d{10}$/;
        if(!reg.test(mobile)) {
            alert("请输入正确的手机号！");
            return false;
        }
        //项目图片
        var img = $('#img').val();
        if(!img){
            alert("请上传项目图片！");
            return false;
        }
    }
</script>

</body>
</html>